{extend name="common:frm_base" /}
{block name="content"}
<div class="layui-fluid">
  <div class="layui-row layui-col-space15">
    <div class="layui-col-md12">
      <div class="layui-row layui-col-space15">
        <div class="layui-col-md6">
          <div class="layui-card" style="height:240px;">
            <div class="layui-card-header">待办事项</div>
            <div class="layui-card-body">
              <div class="layadmin-backlog">
                <div carousel-item>
                  <ul class="layui-row layui-col-space10">
                    {if !$_SESSION['xm_travel']['admin_info']['oid'] && !$_SESSION['xm_travel']['admin_info']['site_id']}
                    <li class="layui-col-xs6">
                      <a  lay-href="{:url('site_team/audit')}" class="layadmin-backlog-body">
                        <h3>服务队审核</h3>
                        <p><cite>{$audit[0]}</cite></p>
                      </a>
                    </li>
                    <li class="layui-col-xs6">
                      <a  lay-href="{:url('Volunteer/audit_u')}" class="layadmin-backlog-body">
                        <h3>志愿者审核</h3>
                        <p><cite>{$audit[1]}</cite></p>
                      </a>
                    </li>
                    <li class="layui-col-xs6">
                      <a  lay-href="{:url('Volunteer/audit_o')}" class="layadmin-backlog-body">
                        <h3>组织审核</h3>
                        <p><cite>{$audit[2]}</cite></p>
                      </a>
                    </li>
                    <li class="layui-col-xs6">
                      <a  lay-href="{:url('Practice/audit')}" class="layadmin-backlog-body">
                        <h3>活动审核</h3>
                        <p><cite>{$audit[3]}</cite></p>
                      </a>
                    </li>
                    {/if}
                    <!--<li class="layui-col-xs6">-->
                      <!--<a class="layadmin-backlog-body">-->
                        <!--<h3>会员数量</h3>-->
                        <!--<p><cite>{$audit[1]}</cite></p>-->
                      <!--</a>-->
                    <!--</li>-->
                    <!--<li class="layui-col-xs6">-->
                      <!--<a class="layadmin-backlog-body">-->
                        <!--<h3>资讯数量</h3>-->
                        <!--<p><cite>{$audit[2]}</cite></p>-->
                      <!--</a>-->
                    <!--</li>-->
                    <!--<li class="layui-col-xs6">-->
                      <!--<a class="layadmin-backlog-body">-->
                        <!--<h3>讲堂数量</h3>-->
                        <!--<p><cite>{$audit[3]}</cite></p>-->
                      <!--</a>-->
                    <!--</li>-->
                  </ul>
                </div>
              </div>
            </div>
          </div>
        </div>
        <div class="layui-col-md6">
          <div class="layui-card" style="height:240px;">
            <div class="layui-card-header">统计数据</div>
            <div class="layui-card-body">
              <div class="layadmin-backlog">
                <div carousel-item>
                  <ul class="layui-row layui-col-space10">
                    <li class="layui-col-xs6">
                      <a class="layadmin-backlog-body">
                        <h3>会员数量</h3>
                        <p><cite style="font-size: 20px;color: #FF5722;">{$count[0]}</cite></p>
                      </a>
                    </li>
                    <li class="layui-col-xs6">
                      <a class="layadmin-backlog-body">
                        <h3>资讯数量</h3>
                        <p><cite style="font-size: 20px;color: #FF5722;">{$count[1]}</cite></p>
                      </a>
                    </li>
                    <li class="layui-col-xs6">
                      <a class="layadmin-backlog-body">
                        <h3>活动数量</h3>
                        <p><cite style="font-size: 20px;color: #FF5722;">{$count[2]}</cite></p>
                      </a>
                    </li>
                    <li class="layui-col-xs6">
                      <a class="layadmin-backlog-body">
                        <h3>讲堂数量</h3>
                        <p><cite style="font-size: 20px;color: #FF5722;">{$count[3]}</cite></p>
                      </a>
                    </li>
                  </ul>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>


      <!--<div class="layui-card">-->
      <!--<div class="layui-card-header">效果报告</div>-->
      <!--<div class="layui-card-body layadmin-takerates">-->
      <!--<div class="layui-progress" lay-showPercent="yes">-->
      <!--<h3>转化率（日同比 28% <span class="layui-edge layui-edge-top" lay-tips="增长" lay-offset="-15"></span>）</h3>-->
      <!--<div class="layui-progress-bar" lay-percent="65%"></div>-->
      <!--</div>-->
      <!--<div class="layui-progress" lay-showPercent="yes">-->
      <!--<h3>签到率（日同比 11% <span class="layui-edge layui-edge-bottom" lay-tips="下降" lay-offset="-15"></span>）</h3>-->
      <!--<div class="layui-progress-bar" lay-percent="32%"></div>-->
      <!--</div>-->
      <!--</div>-->
      <!--</div>-->
    </div>

  </div>
</div>
<script src="__JS__/echats.js"></script>
<script>
    function chart_list(data,data_y,title,maxVal){
        var myChart = echarts.init(document.getElementById('main'));
        option = {
            title:{
                textStyle:{
                    height:1
                }
            },
            tooltip: {
                triggerOn: 'mousemove',
                formatter: function (params) {
                    return 'X: ' + params.data[0] + '<br>Y: ' + params.data[1].toFixed(2);
                }
            },
            xAxis: {
                type: 'category',
                boundaryGap: false,
                data: data_y,
                axisLine:{
                    lineStyle:{
                        color:'#c9c9c9',
                        width:1,//这里是为了突出显示加上的
                    }
                },
                axisTick: {
                    show: false
                },
                axisLabel:{
                    textStyle: {
                        color: '#c9c9c9',  //更改坐标轴文字颜色
                        fontSize : 10      //更改坐标轴文字大小
                    },
                    interval: 0,//标签设置为全部显示
                    formatter:function(params){
                        var newParamsName = "";// 最终拼接成的字符串
                        var paramsNameNumber = params.length;// 实际标签的个数
                        var provideNumber = 10;// 每行能显示的字的个数
                        var rowNumber = Math.ceil(paramsNameNumber / provideNumber);// 换行的话，需要显示几行，向上取整

                        // 条件等同于rowNumber>1
                        if (paramsNameNumber > provideNumber) {

                            for (var p = 0; p < rowNumber; p++) {
                                var tempStr = "";// 表示每一次截取的字符串
                                var start = p * provideNumber;// 开始截取的位置
                                var end = start + provideNumber;// 结束截取的位置
                                // 此处特殊处理最后一行的索引值
                                if (p == rowNumber - 1) {
                                    // 最后一次不换行
                                    tempStr = params.substring(start, paramsNameNumber);
                                } else {
                                    // 每一次拼接字符串并换行
                                    tempStr = params.substring(start, end) + "\n";
                                }
                                newParamsName += tempStr;// 最终拼成的字符串
                            }

                        } else {
                            // 将旧标签的值赋给新标签
                            newParamsName = params;
                        }
                        //将最终的字符串返回
                        return newParamsName
                    }
                }
            },
            yAxis: {
                scale:true,
                name:title,
                splitNumber:4,
                axisLine:{
                    lineStyle:{
                        color:'#c9c9c9',
                        width:1,
                        //这里是为了突出显示加上的
                    }
                }
            },
            color:['#22cb86'],
            textStyle:{
                color:'#999',
                fontSize:12,
            },
            series: [
                {
                    id: 'a',
                    type: 'line',
                    smooth: true,
                    symbolSize:5,
                    areaStyle: {
                        normal: {
                            color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                                offset: 0,
                                color: '#9be8c8'
                            }, {
                                offset: 1,
                                color: '#9be8c8'
                            }])
                        }
                    },
                    data: data
                }
            ]
        };
        myChart.setOption(option);
    }
    $(function(){
        getInfo(0);
    });
    function getInfo(business_id){
        $.post("{:url('Index/getInfo')}",{business_id:business_id},function(res){
            chart_list(res.data,res.date,'最近半个月订单折线图');
        },'json');
    }
    layui.config({
        base: '__ADMIN__/Layui/layuiadmin/' //静态资源所在路径
    }).extend({
        index: 'lib/index' //主入口模块
    }).use(['index','form'], function(){
        var form = layui.form;
        form.on('select(line_select)', function(data){
            getInfo(data.value);
        });
    });


</script>
{/block}